<#assign ctx=request.contextPath />
<#import '${ctx}/sys/include/head.html' as d/>
<#import '${ctx}/sys/include/table/select.html' as select />
<!DOCTYPE html>
<html>
<head>
<@d.head title="数据源列表" />
</head>
<div class="container" style="margin-top:35px;">
	<div class="layui-form">
		<div class="layui-form-item" id="search-div">
			<label class="layui-form-label">搜索列</label>
			<div class="layui-input-block" style="width:60%">
				<input type="text" id="field_name" name="field_name" placeholder="搜索列" autocomplete="off"
					class="layui-input">
				<input type="hidden" id="parent_name"/>
				<input type="checkbox" title="可搜索" name="field_searchable" lay-filter="field_box" class="layui-input" checked="checked"/>
				<input type="checkbox" title="可聚合" name="field_aggregatable" lay-filter="field_box" class="layui-input" checked="checked"/>
				<div class="layui-btn-group" style="margin-top:4px;">
			        <a id="check_btn" class="layui-btn layui-btn-sm">
						确定选择
			        </a>
			      </div>
			</div>
		</div>
	</div>
</div>
<table class="layui-hide" id="search_table" lay-filter="search_table">
</table>

<script>
layui.use(['table','appJs','layer'],function(){
	var table = layui.table;
	var app = layui.appJs;
	var $ = layui.$;
	var layer = layui.layer;
	var form = layui.form;

	var id = $(parent.document).find("input[name='dsId']").val();

	var colomns = [];
	colomns.push({type:'radio',fixed: 'left'});
	colomns.push({type:'hide',field:'id'});
	colomns.push({field:'name',title:'字段名',sort:true});
	colomns.push({field:'alias',title:'字段别名',sort:true});
	colomns.push({field:'type',title:'类型',sort:true});
	colomns.push({field:'searchable',title:'可搜索',sort:true});
	colomns.push({field:'aggregatable',title:'可聚合',sort:true});
	colomns.push({fixed: 'right', width: 165, align:'center', toolbar: '#itemBar'});

	var tableOptions = {
		    elem: '#search_table'
		    ,url: '${ctx}/biz/data/ds/field_list' //数据接口
		    ,title: ''
		    ,toolbar:'#topBar'
		    ,page: true //开启分页
		    ,cols: [colomns]
		};

	rebuildTable();
	bindSearch();

	function rebuildTable() {
		 var uname = $("#field_name").val();
		  var searchable = $('input[name="field_searchable"]').next().hasClass('layui-form-checked');
		  var aggregatable = $('input[name="field_aggregatable"]').next().hasClass('layui-form-checked');
		  tableOptions.where={
		    		search_field : "name",
		    		search_value:uname,
		    		id:id,
		    		searchable:searchable,
		    		aggregatable:aggregatable
		    }
		    table.render(tableOptions);
	}

	var inputDelay;
	function bindSearch() {
		$("#search-div").show();
		form.on('checkbox(field_box)',function(data){
			rebuildTable();
		});

		$("#field_name").bind('input',function(){
			clearTimeout(inputDelay);
			inputDelay = setTimeout(function(){
				rebuildTable();
			},500);
		});
	}

	/*
	$("#check_btn").bind('click',function(){
		var fix = $("#parent_name").val();
		var checkStatus = table.checkStatus('search_table');
		var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
		if(checkStatus.data.length == 1) {
			var data = checkStatus.data[0];
			var show = [];
			for(var v in data) {
				show.push(data[v])
			}
	   		$(parent.document).find('#search_area_'+fix).find('input:first').val(data['alias']);
	   		$(parent.document).find('#search_area_'+fix).find('input:last').val(data['id']);
		}
	    parent.layer.close(index);
	});
	*/
})
</script>
